.tip_div{
  position: absolute;
  margin-bottom: 30px;
  border-radius:5px;
  border:7px solid #ccc;
}
.tip_div .tip_content{
  width:100%;
  height:100%;
  position:relative;
  z-index:1;
  padding:5px;
  width:auto;
  line-height: 17px;
}
.tip_div .tip_arrow{
    border-style: dashed dashed dashed solid;
    border-width: 16px;
    bottom: -20px;
    font-size: 0;
    height: 0;
    left: 10px;
    position: absolute;
    width: 0;
}
/*****style1 S*****/
.tip_div.style1 {border-color: #F9E98E;}
.tip_div.style1 .tip_content {background-color: #FBF7AA;color: #A27D35;}
.tip_div.style1 .tip_arrow {border-color: transparent transparent transparent #F9E98E;}
/*****style1 E*****/
/*****style2 S*****/
.tip_div.style2 {border-color: #A9DB66;}
.tip_div.style2 .tip_content {background-color: #CDE6AC;color: #58792E;}
.tip_div.style2 .tip_arrow {border-color: transparent transparent transparent #A9DB66;}
/*****style2 E*****/
/*****style3 S*****/
.tip_div.style3 {border-color: #E2E2E2;}
.tip_div.style3 .tip_content {background-color: #fff;color: #454545;}
.tip_div.style3 .tip_arrow {border-color: transparent transparent transparent #E2E2E2;}
/*****style3 E*****/
/*****style4 S*****/
.tip_div.style4 {border-color: #CE6F6F;}
.tip_div.style4 .tip_content {background-color: #F79992;color: #9C2F2F;}
.tip_div.style4 .tip_arrow {border-color: transparent transparent transparent #CE6F6F;}
/*****style4 E*****/
/*****style5 S*****/
.tip_div.style5 {border-color: #303030;}
.tip_div.style5 .tip_content {background-color: #505050;color: #F3F3F3;}
.tip_div.style5 .tip_arrow {border-color: transparent transparent transparent #303030;}
/*****style5 E*****/